<template>
  <div>
    <div v-for="(item,index) in mvList" :key='index'  >
<!--      <MvList :mvId="item.id" ></MvList>-->
      <MvList :mvId="item" @son="playVideo(index)"></MvList>
    </div>
<!--。    <MvList :mvList="mvList"></MvList>-->
    <!--  <video src="http://vodkgeyttp8.vod.126.net/cloudmusic/obj/core/4748656993/94cd1facb8d9d6ef8585b5671e093858.mp4?wsSecret=a434e95d54393ef6d833df00be477c99&wsTime=1606207283" controls></video>-->
  </div>
</template>

<script>
import MvList from "@/components/MvList";
import { getMVvideo} from "@/api/api-MV";

export default {
  name: "MvPage",
  components: {MvList},
  data() {
    return {
      mvId: null,
      mvList: null,
      videoElement:[]
    }

  },
  created() {
    getMVvideo().then(res => {
      console.log(res)
      if (res.code === 200) {
        this.mvList = res.data

      }

    })
  },
  mounted () {
    this.videoElement = document.getElementsByTagName('video') //获取页面上所有的video对象
  },
    methods: {
    playVideo(index) {
      console.log(index)

      const videoElement = this.videoElement
      if (videoElement && videoElement.length > 0) {
        for (let i = 0; i < videoElement.length; i++) {
          if (i === index) {

            this.videoElement[i].play()
          } else {
            this.videoElement [i].pause()

          }
        }
      }
    }
  }
}
  //
  // }

      //
      //
      //
      //
      //   }









// if (res.code === 200) {
//   let idList = []
//   res.data.id.forEach(item => {
//     if (idList.length < 30) {
//       idList.push(item.id)
//     }
//     console.log(idList)
//   })
// getMvCdn(idList.toString()).then(r=>{
//   console.log(r)
//   if(r.code === 200){
//     this.hotmusiclist=r.songs
//   }
// })
// }
// this.hotmusiclist=res.data.result
// })


// },

//   created() {
//   getMVvideo().then(res=>{
//     console.log(res)
//     // if(res.code === 200){
//     //   let idList=[]
//     //   res.playlist.trackIds.forEach(item=> {
//     //     if (idList.length < 30) {
//     //       idList.push(item.id)
//     //     }
//
//         // console.log(songlist)
//       // }
//     // }
//   }),
//   // this.mvId=res.data.id
//   // console.log(this.mvId)
//   // getMvCdn(this.mvId).then(res=>{
//   //   console.log(res)


</script>

<style scoped>

</style>